"use client";
import {message} from "antd";
import QuestionCard from "@/components/QuestionCard";
import "./index.css";
import {useParams} from "next/navigation";
import {getQuestionDetailUsingGet} from "@/api/questionController";
import {useEffect, useState} from "react";

/**
 * 题目详情页
 * @constructor
 */

export default function BankDetailPage() {
  const params = useParams();
  const [question, setQuestion] = useState<API.QuestionVO | null>(null); // 状态管理题目信息

  useEffect(() => {

  });

  useEffect(() => {
    const fetchQuestionData = async () => {
      try {
        const res = await getQuestionDetailUsingGet({
          id: params.questionId as any,
        });
        setQuestion(res.data as API.QuestionVO);
      } catch (e: any) {
        message.error("获取题目详情失败，" + e.message);
      }
    };

    fetchQuestionData();
  }, [params]);

  // 错误处理
  if (!question) {
    return <div>获取题目详情失败，请刷新重试</div>;
  }

  return (
    <div id="questionPage">
      <QuestionCard question={question} />
    </div>
  );
}
